<template>
    <h1>hello about</h1>
</template>

<script>
import { mapStores, mapState, mapActions } from "@/pinia";
import { useCounterStore1 } from "@/stores/counter1";
import { useCounterStore2 } from "@/stores/counter2";
// import { mapStores } from "@/pinia";
// import { mapStores, mapState, mapActions } from "pinia";

export default {
    computed: {
        ...mapStores(useCounterStore1, useCounterStore2),
        ...mapState(useCounterStore1, ["count", "double"]),
        ...mapState(useCounterStore2, { num: "count" }),
    },
    methods: {
        ...mapActions(useCounterStore2, ["increment"]),
        ...mapActions(useCounterStore1, { moar: "increment" }),
    },
    created() {
        console.log(this.counter1Store);
        console.log(this.counter2Store);

        console.log(this.count);
        console.log(this.double);
        console.log(this.num);

        console.log(this.increment);
        console.log(this.moar);
    },
};
</script>
